@import '../../themes/index.less';
.abm_frontend_widget_component_wrapper {

  .ant-card-small > .ant-card-head > .ant-card-head-wrapper > .ant-card-extra {
    padding: 0px
  }

  .ant-collapse-content > .ant-collapse-content-box {
    padding: 6px;
  }

  .ant-collapse > .ant-collapse-item > .ant-collapse-header {
    padding: 6px 8px 6px 24px;

    .ant-collapse-arrow {
      left: 8px;
    }

  }
  .ant-collapse-borderless {
    background-color: @component-background;
    border: 0;
  }
  .ant-collapse-borderless > .ant-collapse-item {
    border-bottom: none;
  }

  .ant-tabs .ant-tabs-large-bar .ant-tabs-nav-container{
    font-size: 14px;
  }

  .input-search-wrapper{
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    color: rgba(0,0,0,.65);
    font-size: 14px;
    font-variant: tabular-nums;
    line-height: 1.5;
    list-style: none;
    -webkit-font-feature-settings: 'tnum';
    font-feature-settings: 'tnum';
    position: relative;
    display: table;
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
  }

  .card-wrapper-title-prefix {
     width: 4px;
     height:20px;
     background-color: @primary-color;
   }

  .card-title-wrapper {
    align-items: center;
    display: flex;
    min-height: 36px;
  }

  .ant-card-head {
    .ant-card-head-wrapper{
      .ant-card-head-title {
        padding: 0px;
      }
      .ant-card-extra {
        padding: 0px 0;
      }
    }
  }

}

.code-box-title {
  position: absolute;
  top: -8px;
  margin-left: 16px;
  font-size: 12px;
  padding: 0px 8px;
  color: #777;
  background: @component-background;
  border-radius: 2px 2px 0 0;
  transition: background-color .4s;
  z-index: 9;
  .action-icon {
     margin-left: 16px;
     .delete {
       color:#f50
     }
  }
}

.handle-card-title {
  .ant-tabs > .ant-tabs-nav, .ant-tabs > div > .ant-tabs-nav {
    flex-direction: row-reverse;
  }
}
.fluid_page_designer_container {
   margin: 8px;
   .row_container_wrapper{
     cursor: move;
     margin-bottom:8px;
     width: 100%;
     overflow:auto;
     padding: 8px;
     border: 1px solid #e8e8e8;
   }
   .row_edit_handler {
     width: 32px;
     height: 96px;
     padding-top: 8px;
     border: 1px solid #e8e8e8;
     border-right-width: 0;
     border-radius: 4px;
     border-top-right-radius: 0;
     border-bottom-right-radius: 0;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-orient: vertical;
     -webkit-box-direction: normal;
     -ms-flex-direction: column;
     flex-direction: column;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     gap: 6px;
     color: #8c8c8c;
     .action-icon {
       margin-top: 8px;
       .delete {
         color:#f50
       }
     }
   }
   .add_handler_button {
      width: 100%;
      margin-top: 8px;
   }
  .blank_widget_placeholder {
    width: 100%;
    padding: 8px;
    border: 1px dashed #d9d9d9;
    border-radius:5px;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .add_handler_button_large {
    height: 200px;
    border-radius: 14px;
    margin-top:120px;
    width: 200px;
    border: 2px solid var(--PrimaryColor);
    &:hover {
      transform: translate(0,-3px);
      box-shadow: 6px 6px 3px #888888;
    }
  }
}
